<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@include file="/WEB-INF/pages/common/taglib.jsp"%>
<!DOCTYPE html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>陇上无限学——陇南情Malron</title>
	<link rel="icon" href="${basePath}/resources/images/tmtitle.png">
	<link rel="icon" href="${basePath}/resources/images/tmtitle.png" type="image/x-icon" />
	<link href="${basePath}/resources/css/book.css" rel="stylesheet" type="text/css" /></link>
	<link rel="stylesheet" type="text/css" href="${basePath}/resources/css/logs.css"></link>
	<%@include file="../common/common.jsp" %>
	<link type="text/css" rel="stylesheet" href="${basePath}/resources/js/editer/themes/default/css/umeditor.css"></link>
	<script type="text/javascript" charset="utf-8" src="${basePath}/resources/js/editer/umeditor.config.js"></script>
	<script type="text/javascript" charset="utf-8" src="${basePath}/resources/js/editer/umeditor.min.js"></script>
	<script type="text/javascript" charset="utf-8" src="${basePath}/resources/js/book.js"></script>
	<script type="text/javascript" src="${basePath}/resources/sg/sg.js"></script>
</head>
<body data-userid="${session_user.id}">
<!--top start-->
<%@include file="../common/head.jsp" %>
<!--top start-->
<tz:if test="${session_user.username != null}">
	<tz:then>
		<div class="box wid700  "> 
		    <div class="selfinfo">
		       	<div class="logo">
		            <a href="javascript:void(0)"><img style="border-radius: 80px" src="${basePath}/${session_user.pic}" height="80"><i></i></a>
		        </div>
		       	<h1><a href="javascript:void(0)"></a></h1>
		        <div id="change_color" class="text">我叫${session_user.username}，${session_user.description}</div>
		    </div>
		    <div class="sch">
		        <form action="/search" method="get">
		            <input value="搜索" type="text" name="q" onfocus="if(this.value=='搜索'){this.value='';}" onblur="if(this.value==''){this.value='搜索';}" class="txt">
		        </form>
		    </div>
		</div>
	</tz:then>
	<tz:else></tz:else>
</tz:if>
<div id="message" class="postwrapper box wid700  ">
     <div class="mes_nr">
     	 <input style="text-indent:1em" type="text" id="title"  class="input" autofocus="autofocus" placeholder="请输入标题" maxlength="10">
	     <br>
	     <br>
	     <textarea id="myEditor" class="input text_area" style="height: 240px;text-indent:2em;" maxlength="140"  placeholder="请输入评论信息长度不能超过140位!"></textarea>
	     <br>
     	 <div id="tagMsg" style="display:none;float:left;width:300px;height:30px;font-size:16px;color:red;line-height:30px;text-indent:0.5em;"></div>
	     <div class="fabiao"><input type="button" data-userid="" id="tm_sendcomment" class="submit" value="发表留言"><span>还可以输入<label id="count">140</label>字</span></div>
	     <div class="clearfix"></div>
	</div>
</div>
		<div class="postwrapper box wid700" id="contentbox">
		<c:forEach var="book" items="${books}" varStatus="booksindex">
			<div class='block photo'>
				<label style='font-weight: 700;font-size: 18px;'>${book.title}</label>
				<div class='side'>
					<div class='day'><a href='javascript:void(0);'>${tz:formatDate(book.createTime,'MM')}</a></div>
					<div class='month'><a href='javascript:void(0);'>${tz:formatDate(book.createTime,'dd')}</a></div>
				</div>
				<div class='main'>
					<div class='content'>${book.content}</div>
					<div class='link' id="comment_${book.id}" data-opid="${book.id}">
						<a href='javascript:void(0);' data-bookid='${book.id}' onclick="tm_book.tm_comment('comment_${book.id}');">评论(1)</a>
						<a href='javascript:void(0);' data-bookid='${book.id}' onclick=''>转发</a>
						<a href='javascript:void(0);' data-bookid='${book.id}' onclick=''>点赞</a>
					</div>
					<div id="comment${book.id}">
					  <c:forEach var="comment" items="${comments}">
						<div class="submitted">
							<span><a href="javascript:void(0)" title="查看用户资料" class="username">${comment.author}</a></span>
							<span class="marker">${tz:formatDate(comment.createTime,'yyyy-MM-dd HH:mm:ss')}</span>
						</div>
						<div class="content1">${comment.content}</div>
					  </c:forEach>
					</div>
				</div>
		    </div>
		</c:forEach>
		</div>
		<!-- 加载按钮 -->
		<div class="loadmore"><a href="javascript:void(0);" class="wid700" onclick="tmOption.loadData(this)"><i class="iconfont icon-bell"></i><span class="text">加载更多数据</span></a></div>
	<!--bottom start-->
<%@include file="/common/bottom.jsp" %>
<!--bottom end-->
<div id="tm_top">
	<a href="" onclick="" ><i class="fa fa-arrow-up" style="font-size:32px"></i></a>
</div>
<script type="text/javascript">
	var um = UM.getEditor("myEditor");
	//获取富文本编辑器的带有格式的内容
	function getEditoHtml(myEditor){
		return UM.getEditor(myEditor).getContent();
	}
	
	//获取富文本编辑器的纯文本内容
	function getEditText(myEditor){
		return UM.getEditor(myEditor).getContentTxt();
	}
	
	//给某个富文本框赋值
	function setEditorText(message,myEditor){
		 UM.getEditor(myEditor).setContent(message, false);//清空富文本编辑器
	}
	
	//显示错误信息
	function tm_showmessage(message){
		$("#tagMsg").show().html(message).stop(true,true).fadeOut(3000);
	}
	
	var tm_book = {
		mark : true,
		opid : "",
		id : "",
		loadData:function(){
			
		},
		tm_comment:function(obj){
			var userid = $("body").data("userid");
			if(isEmpty(userid)){
				tzMessage.tip("请登录!");
				tmLogin.dialog();
				return;
			}else{
				tm_book.opid = obj;
				tm_book.id = $("#"+obj).data("opid");
				if(this.mark){tm_book.showArea();}
			}
		},
		showArea:function(){
			var html = "<div id='c_"+tm_book.opid+"'>"+
			           "<textarea id='text_"+tm_book.opid+"' style='width:80%;height:60px;text-indent:1em'></textarea>"+
			           "<a href='javascript:void(0);' onclick='tm_book.tm_saveContent();'>发表</a></div>";
			$("#comment"+tm_book.id).prepend(html);
			this.mark = false;
		},
		hideArea:function(){
			$("#c_"+tm_book.opid).remove();
			this.mark = true;
		},
		tm_saveContent:function(){
			var content = $("#text_"+tm_book.opid).val();
			var html =  "<div class='submitted'>"+
						"<span><a href='#' title='查看用户资料' class='username'>Maron</a></span>"+
						"<span class='marker'>"+(new Date).format("yyyy-MM-dd HH:mm:ss")+"</span>"+
						"</div>"+
						"<div class='content1'>"+content+"</div>";
			if(isEmpty(content)){
				$("#text_"+tm_book.opid).focus();
				tzMessage.tip("评论内容不能为空!");
				return;
			}
			$("#"+tm_book.opid).after(html);
			var bookId = tm_book.id;
			var userId = $("body").data("userid");
			var params = {
				userId : userId,
				bookId : bookId,
				content : content
			};
			$.ajax({
				type:"post",
				url:basePath+"/stage/bookcomment/save",
				data:params,
				success:function(data){
					if(data="success"){
						tzMessage.tip("评论成功！");
					}else{
						tzMessage.tip("评论失败！");
					}
				}
			});
			tm_book.hideArea();
		}	
	};
</script>
</body>
</html>